<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title><?=config_item('my_title')?></title>
    <base href="<?=base_url()?>">
    <link rel="stylesheet" href="plugin/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<?php require_once(VIEWPATH.'include/header.html');?>
<!-- 主内容区域 -->
<div class="container-fluid iframe-container">
    <?php require_once(VIEWPATH.'include/sidebar.html');?>
    <!-- 主面板 -->
    <div class="iframe-main">
        <div class="iframe-main-section">
            <div class="section_container">
                <div class="panel">
                    <div class="panel-heading">
                        <div class="panel-title"><?=$section_name?></div>
                    </div>
                    <div class="panel-body">
                        <div class="form-inline search_bar">
                            <?=$insert_btn?>
                            <?=$del_btn?>
                            <input type="text" name="key" class="form-control input-sm">
                            <button type="button" class="btn btn-default btn-sm search-btn-hook">搜索</button>
                        </div>
                        <div class="table-responsive">
                            <table class="table table-hover table_list list-hook">
                                <thead>
                                <tr>
                                    <th width="5%">
                                        <label><input type="checkbox" name="checkAll" data-checkname="id">
                                            <ins></ins>
                                        </label>
                                    </th>
                                    <th>名称</th>
                                    <th width="20%">变量名</th>
                                    <th width="10%">类型</th>
                                    <th width="10%">配置组</th>
                                    <th width="10%">状态</th>
                                    <th width="10%">排序</th>
                                    <th width="10%">操作</th>
                                </tr>
                                </thead>
                                <tbody class="list-body-hook"></tbody>
                                <script id="listTpl" type="text/html">
                                    {{each list as val}}
                                    <tr>
                                        <td><label><input type="checkbox" name="id[]"
                                                          value="{{val.id}}">
                                            <ins></ins>
                                        </label></td>
                                        <td>{{val.name}}</td>
                                        <td>{{val.variable}}</td>
                                        <td>{{val.type}}</td>
                                        <td>{{val.config_group_name}}</td>
                                        <td><a href="javascript:;" class="editable-hook"
                                               data-pk="{{val.id}}"
                                               data-value="{{val.display}}"
                                               data-source='<?=$display_source?>'
                                               data-params="{field: 'display', tbname: 'config'}">{{#val.display_name}}</a>
                                        </td>
                                        <td><a href="javascript:;" class="editable-hook"
                                               data-pk="{{val.id}}"
                                               data-type="text"
                                               data-params="{field:'sort',tbname:'config'}">{{val.sort}}</a></td>
                                        <td>
                                            {{each val.opera_btn as btn}}
                                            {{#btn}}
                                            {{/each}}
                                        </td>
                                    </tr>
                                    {{/each}}
                                </script>
                            </table>
                        </div>
                        <div class="pagination_box pagination-hook"></div>
                        <script id="paginationTpl" type="text/html">
                            {{#pagination}}
                        </script>
                    </div>
                </div>
                <div class="search_bar">

                </div>
                <div class="panel panel-default">

                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" src="plugin/require.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript">
    require(['unit'], function (unit) {
        getList();

        //分页
        unit.pagination(function () {
            getList($(this).data('page'));
        });

        //搜索
        unit.search(function () {
            getList();
        });

        //获取列表
        function getList(pageIndex) {
            unit.getList({
                url: '<?=$get_list_url?>',
                data: {
                    x: Math.random(),
                    page: pageIndex,
                    key: $('input[name="key"]').val()
                },
                complete: function () {
                    unit.editable();
                }
            });
        }
    });
</script>
</body>
</html>